<style lang="less">
 @import './layout.less';
</style>

<template>
  <a-layout class="app">
    <v-header />

    <v-content :class="{ 'content-nofooter': !isShowFooter }">
      <nuxt />
    </v-content>

    <v-footer v-show="isShowFooter" />
  </a-layout>
</template>

<script>
import { mapState, mapMutations } from 'vuex'
import Content from './content'
import Header from './header'
import Footer from './footer'

export default {
  components: {
    'v-content': Content,
    'v-header': Header,
    'v-footer': Footer,
  },

  computed: {
    ...mapState({
      useFooter: ({ config = {} }) => config.useFooter,
      useHomeSider: ({ config = {} }) => config.useHomeSider,
    }),

    isHomePage () {
      const { path = '/' } = this.$route

      return path === '/'
    },

    isShowFooter () {
      if (this.isHomePage) { // 首页s
        return !this.useHomeSider // 右侧边栏不显示时，才显示页脚
      }

      return this.useFooter
    },
  },

  methods: {
    ...mapMutations({
      changeFooter: 'config/changeFooter',
    }),
  },
}
</script>
